JavaScript works mostly like if variables are passed by value.

Does JavaScript pass variables by value or reference?

In some programming languages (VB, PHP) you pass arguments into functions by value or by reference ...

In JavaScript (JS) you write the arguments within the parentheses to the function being called, just like in most other programming languages:

f(a, b, c); // Calling function f with arguments a, b and c

function f(x, y, z) {}

The variables (x, y, z) declared within the parentheses of the function constructor - will belong to the function scope and can not be accessed outside the function!

When thinking about variables in JS you should think about them as pointers to objects.
The variables in the arguments (x, y, z) points to the same objects as the variables in the function call (a, b, c).

Pointing variables declared inside a function will not affect variables outside the function.
You can however from within the function re-point/re-assign variables from the parent lexical scope.

var a = [1, 2, 3]; // points to object Array
var text = "abc";

function doSomething(arr) {
	arr[0] = 99;
	arr = null;
	text = null;
}

doSomething(a); // Calls function

Argument (arr) points to the same object array variable (a) points to.
Variable text is never declared in the function. It's a global variable accessible everywhere.

The doSomething-function change the first post in the object array to number 99.
Then points variables arr and text to null.
Variable (a) still points to the object array, that is now [99,2,3].

Primitives

There are two types of objects in JS: primitives and objects.
The primitives; string, number and boolean, behaves like values, and you can not add properties to them.

The two code snippets below compares the behavior of primitives versus objects:

var a = 1;       // number
var b = a;       // b gets the same value as a
a++;             // a is incremented, but b is still 1
var a = [1,2,3]; // points a to an object array
var b = a;       // points b to the same object array a points to
a.push(4);       // value 4 is added to the object array

When asking a JS programmer if variables are passed by reference or by value it might be a bit confusing.
The following function behaves like if the variable was passed by reference:

function doSomething(arr) {
	arr[0] = 99;
}

And you can not simply copy an object like in the code example below. Unless you pass it a primitive!

function copy(obj) {
	return obj;
}

But you can not, from within the function, change where a variable passed to it points to!
Thus all objects in JavaScript are passed by value. Where the value of a non-primitive (compound) object is the reference to the object.

Variables pointing to objects

For variables pointing to primitives you can think of them as holding values. But for variables pointing to objects, you have to think of them as pointers. Imagine them as road signs.

var	timeout = setTimeout(function(){
	alert("foo");
}, 1000);

timeout = null;

Variable timeout is pointed to a new setTimeout object.
Variable timeout is then pointed to null. But the setTimeout object still exist.


Written by April 12th 2015.


Follow me via RSS:   RSS https://zäta.com/rss_en.xml (copy to feed-reader)
or Github:   Github https://github.com/Z3TA